import React, { createContext, useContext, useMemo, useState } from 'react'

type GlobalContextValue = {
  global: any
  setGlobal: React.Dispatch<React.SetStateAction<any>>
}

const GlobalContext = createContext<GlobalContextValue | null>(null)

export const GlobalProvider: React.FC<{
  initialValue?: any
  children: React.ReactNode
}> = ({ initialValue, children }) => {
  const [global, setGlobal] = useState<any>(initialValue ?? {})

  const value = useMemo(() => ({ global, setGlobal }), [global])

  return (
    <GlobalContext.Provider value={value}>{children}</GlobalContext.Provider>
  )
}

export const useGlobal = () => useContext(GlobalContext)

export default GlobalContext
